<template>
  <el-dialog :visible="dialogVisible"
             :close-on-click-modal="false"
             append-to-body
             custom-class="trace-dailog"
             @close="onClose">
    <el-tabs v-model="activeName"
             @tab-click="handleClick"
             type="card">
      <el-tab-pane label="测站信息"
                   name="info">
        <site-detail-info @close-detail="onClose"
                          :site-info="siteInfo"
                          ref="sitedetail"></site-detail-info>
      </el-tab-pane>
    </el-tabs>
    <div slot="footer"
         class="dialog-footer">
      <el-button type="info"
                 @click="onClose"
                 size="small"
                 v-if="activeName === 'info'">取 消</el-button>
      <el-button type="primary"
                 size="small"
                 @click="onChange"
                 v-if="activeName === 'info'">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import SiteDetailInfo from './site-detail-info'
// import Bus from '@/utils/bus'

export default {
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    siteInfo: Object
  },
  data() {
    return {
      activeName: 'info' // tag标签默认选中跟踪记录
    }
  },
  mounted() {

  },
  methods: {
    // 修改内容提交确定
    onChange() {
      if (this.activeName === 'info') this.$refs.sitedetail.updateSiteInfo()
    },
    // Tag标签点击事件
    handleClick(tab) {

    },
    onClose() {
      this.$emit('close')
    }
  },
  components: {
    SiteDetailInfo
  }
}
</script>
